import { px2rad, r3cor, r4cor } from './calculate2.js'

registerPaint('smooth-corner', class {
  
  static get inputProperties() {
    return ['--smooth-corner', '--corner-radius']
  }
  
  paint(ctx, size, props) {
    ctx.fillStyle = 'black'
    
    let alpha = Math.PI / 1800
    let m = props.get('--smooth-corner').value
    let radArr = props.getAll('--corner-radius')
    let rl = radArr.length
    console.log(m)
    
    const w = size.width
    const h = size.height
    const mil = w < h ? w : h
    var brrx, brry, blrx, blry, tlrx, tlry, trrx, trry;
    
    if(rl === 1) {
      let rad = px2rad(radArr[0].value, m)
      rad = rad > mil/2 ? mil/2 : rad
      brrx = brry = blrx = blry = tlrx = tlry = trrx = trry = rad
      console.log(rad)
    } else if (rl === 2) {
      let rad1 = px2rad(radArr[0].value, m) - 0
      let rad2 = px2rad(radArr[1].value, m) - 0
      console.log('2ro: ' + rad1 + ' ' + rad2)
      console.log(w)
      if(rad1 + rad2 > mil) {
        let rat = (mil/(rad1 + rad2)).toFixed(2)
        rad1 = (rad1*rat)
        rad2 = (rad2*rat)
      }
      tlrx = tlry = brrx = brry = rad1
      trrx = trry = blrx = blry = rad2
      console.log("2r: " + rad1 + " " + rad2)
    } else if (rl === 3) {
      const rad = [0, 0, 0]
      for(let i = 0; i < 3; i++) {
        rad[i] = px2rad(radArr[i].value, m) - 0
      }
      let ret = r3cor(w, h, ...rad)
      console.log("ret3: " + ret)
      tlrx = tlry = ret[0]
      trrx = trry = blrx = blry = ret[1]
      brrx = brry = ret[2]
      console.log("3r: " + rad)
    } else if(rl === 4) {
      const rad = [0, 0, 0, 0]
      for(let i = 0; i < 4; i++) {
        rad[i] = px2rad(radArr[i].value, m) - 0
      }
      console.log('4r: ' + rad)
      let ret = r4cor(w, h, ...rad)
      console.log("ret4: " + ret)
      tlrx = tlry = ret[0]
      trrx = trry = ret[1]
      brrx = brry = ret[2]
      blrx = blry = ret[3]
    } else if(rl === 8) {
      const rad = [0, 0, 0, 0, 0, 0, 0, 0]
      for(let i = 0; i < 8; i++) {
        rad[i] = px2rad(radArr[i].value, m) - 0
      }
      console.log('8r: ' + rad)
      tlrx = rad[0]; tlry = rad[4]
      trrx = rad[1]; trry = rad[5]
      brrx = rad[2]; brry = rad[6]
      blrx = rad[3]; blry = rad[7]
    }
    
    // bottom-right
    for(let i = 0; i < alpha * 900; i += alpha) {
        let x = brrx * Math.pow(Math.cos(i), 2 / m) + w - brrx;
        let y = brry * Math.pow(Math.sin(i), 2 / m) + h - brry;
        if(i == 0)
            ctx.moveTo(x, y)
        else
            ctx.lineTo(x, y)
        // console.log(x)
        // console.log(y)
    }
    
    // bottom-left
    for(let i = alpha * 900; i >= 0; i -= alpha) {
        let x = -blrx * Math.pow(Math.cos(i), 2 / m) + blrx;
        let y = blry * Math.pow(Math.sin(i), 2 / m) + h - blry;
        ctx.lineTo(x, y)
    }
    
    // top-left
    for(let i = 0; i < alpha * 900; i += alpha) {
        const x = -tlrx * Math.pow(Math.cos(i), 2 / m) + tlrx;
        const y = -tlry * Math.pow(Math.sin(i), 2 / m) + tlry;
        ctx.lineTo(x, y)
    }
    
    // top-right
    for(let i = 900 * alpha; i >= 0; i -= alpha) {
        const x = trrx * Math.pow(Math.cos(i), 2 / m) + w - trrx;
        const y = -trry * Math.pow(Math.sin(i), 2 / m) + trry;
        ctx.lineTo(x, y)
    }
    
    
    ctx.closePath()
    ctx.fill()
  }
})
